import { messages } from "share/common";
import React from 'react'
import { connect } from 'react-redux'
import { Button, Badge, Table, Icon } from 'antd'
import BasicInfo from 'components/basic-info'
import menuRoute from 'routes/menuRoute'
import { setStandardRulesGroup } from 'actions/setting'

class ReimbursementStandardRulesGroup extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      ruleGroup: {},
      columns: [
        {title: '序号', dataIndex: 'index'},
        {title: '编码', dataIndex: 'code'},
        {title: '费用类型名称', dataIndex: 'name'},
        {title: '费用图标', dataIndex: 'iconURL', render: iconURL => <img src={iconURL} style={{ height: 20 }}/>},
        {title: '费用分类', dataIndex: 'categoryName'},
        {title: '是否分摊', dataIndex: 'apportionEnabled', render: apportionEnabled => apportionEnabled ? '是' : '否'},
        {title: '费用状态', dataIndex: 'enabled',
          render: status => <Badge status={status ? 'success' : 'error'} text={status ? '启用' : '禁用'} />
        },
        {title: '操作', dataIndex: 'operate', render: (text, record) => (
          <span>
            <a onClick={() => this.goRules(record)}>设置规则</a>
          </span>)
        }
      ],
      data: [],
      infoList: [
        {type: 'input', label: '规则集名称', id: 'name'},
        {type: 'input', label: '规则集编码', id: 'code'},
        {type: 'switch', label: '规则集状态', id: 'enabled'},
      ]
    }
  }

  goRules = record => {
    let { standardRulesGroup } = this.props;
    let url = menuRoute.getRouteItem('expense-type-rules').url;
    this.context.router.push(url.replace(':groupId', standardRulesGroup.id).replace(':expenseTypeId', record.id))
  };

  componentDidMount(){
    let groupId = this.props.params.groupId;
    if(groupId){
      let ruleGroup = {
        id: 1, code: 'DEFAULT_RULE', name: '默认规则', company: '中国公司', enabled: true
      };
      this.props.dispatch(setStandardRulesGroup(ruleGroup));
      this.setState({
        ruleGroup,
        data: [{
          index: 1,
          id: '1034342205726870124',
          code: 'DEFAULT_SOBEXP0050',
          name: '中控测试费用标准',
          iconURL: 'https://huilianyi-static.oss-cn-shanghai.aliyuncs.com//cf2b3694-b4f8-4aca-b233-111748eb025b/expenseIcon/e547b892-8f48-498f-8ecf-90ee3fb5fcf3-door.png',
          categoryName: '费用大类',
          apportionEnabled: true,
          enabled: true,
          expenseTypeOID: 'f2e1379a-4f4a-4c78-b04e-1667b635095e'
        }]
      })
    }
  }

  render() {
    const { data, columns, infoList, ruleGroup } = this.state;
    return (
      <div>
        <BasicInfo infoList={infoList}
                   infoData={ruleGroup}
                   isHideEditBtn/>
        <div style={{ margin: '30px 0 10px 0' }}>
          <Button type="primary">
            <Icon type="plus" />&nbsp;选择费用
          </Button>
          <Button style={{ marginLeft: 20 }}>导入</Button>
        </div>
        <Table dataSource={data}
               columns={columns}
               rowKey="id"/>
      </div>
    )
  }
}

ReimbursementStandardRulesGroup.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return {
    standardRulesGroup: state.setting.standardRulesGroup
  }
}

export default connect(mapStateToProps)(ReimbursementStandardRulesGroup)
